<template>
    <div>
        <div class="q_xxpxjl">
            <img src="" alt="">
            <div> 上传申报资料</div>
        </div>
        <div class="q_sub text-center">
            <input type="button" value="初级和中级" class="btn btn-primary">
            <input type="button" value="高级" class="btn btn-outline-primary">
        </div>
        <div id="q_scylqk">
            <div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;专业技术职务任职资格评审表</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 150px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;本人政治思想及专业技术总结</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 150px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;学历学位证明</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 275px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;年度考核登记表</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 255px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;公示情况证明</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 275px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;申报情况一览表</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 255px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span>破格申报审核表</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 275px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
            </div>
            <div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;单位综合推荐意见</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 240px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;代表作</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 328px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;现职称证书及聘任证书</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 205px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;继续教育登记证书</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 240px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span><samp>*</samp>&nbsp;&nbsp;个人申报专业技术任职资格诚信承诺书</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 80px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span>委托评审函</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 316px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
                <div>
                    <div class="innersc">
                        <span>其他附件（只能上传PDF格式</span>
                        <input type="button" value="上传" class="btn btn-primary" style="margin-left: 172px;">
                        <input type="button" value="预览" class="btn btn-outline-primary">
                        <input type="button" value="清空" class="btn btn-outline-primary">
                    </div>
                </div>
            </div>
        </div>
        <div class="q_sub1">
            <input type="button" value="取消" class="">
            <input type="submit" value="提交" class="btn btn-primary" id="zzcen">
        </div>
        <div class="zzclr" id="zzclr">
            <div>
                <p>确认是否进行提交?</p>
                <input type="button" value="取消提交" class="btn btn-secondary">
                <input type="submit" value="确认提交" class="btn btn-primary">

                <div><p id="dkgb">返回编辑上传页&nbsp;</p>></div>
            </div>

        </div>
    </div>
</template>

<script>
    export default {
        name: "UploadFile"
    }
</script>

<style scoped>
    * {
        margin: 0%;
        padding: 0;
    }

    a {
        text-decoration: none;
    }

    li {
        list-style: none;
    }

    .q_xxpxjl {
        width: 800px;
        height: 120px;
        margin: 20px auto;
    }

    .q_xxpxjl > img {
        float: left;
    }

    .q_xxpxjl > div {
        width: 400px;
        font-size: 24px;
        line-height: 120px;
        float: left;
        margin-left: 8%;
        font-weight: 800;
    }


    .q_sub {
        width: 800px;
        height: 40px;
        margin: 30px auto;
    }

    .q_sub > input {
        margin-left: 10px;
        border: 1px solid blue;
        float: left;
        border-radius: 5px;
        color: blue;
        padding: 8px 18px;
    }

    .q_sub > input:nth-child(1) {
        background-color: rgb(48, 102, 227);
        color: white;
        margin-left: 36%;
    }

    .q_sub1 {
        width: 800px;
        height: 40px;
        margin: 30px auto;
    }

    .q_sub1 > input {
        margin-left: 10px;
        border: 1px solid blue;
        float: left;
        border-radius: 5px;
        padding: 8px 18px;
    }

    .q_sub1 > input:nth-child(1) {
        color: blue;
        margin-left: 42%;
    }


    #q_scylqk {
        width: 1400px;

        margin: 30px auto;
        /* border: 1px solid #000; */

        display: flex;
    }

    #q_scylqk > div {
        flex: 1;
       
    }

    .innersc {
        width: 100%;
        height: 100px;
        margin: 30px 40px;
        /* float: left; */
        flex: 1;
    }

    .innersc > span {
        margin-left: 20px;
        font-size: 18px;
    }

    .innersc > input {
        border: 1px solid blue;
        border-radius: 5px;
        padding: 5px 14px;
        margin: 30px 0px;
        text-align: right;
    }

    .button1 {
        background-color: rgb(48, 102, 227);
        color: #ffffff;
    }

    #q_scylqk > div > div {
        flex: 1;
        height: 100px;
        margin-top: 21px;
        box-shadow: 0px 0px 10px #DEDEDE;
        width: 673px;
    }

    #q_scylqk > div:nth-child(2) {
        margin-left: 50px;
    }

    .zzclr {
        height: 100%;
        width: 100%;
        background: rgba(0, 0, 0, 0.5);
        position: fixed;
        top: 0;
        left: 0;
        display: none;

    }

    .zzclr > div {
        width: 600px;
        height: 400px;
        background: #FFFFFF;
        margin: 300px auto;

        text-align: center;
        font-weight: bold;
    }

    .zzclr > div > p {
        line-height: 200px;
        font-weight: 800;
        font-size: 25px;
    }

    .zzclr > div > input {
        padding: 8px 26px;
        margin-right: 55px;
        margin-left: 45px;
        font-size: 18px;
    }

    .zzclr > div > div > p {
        color: rgb(71, 71, 71);
        font-size: 16px;
        text-decoration: underline;
        cursor: pointer;
    }

    .zzclr > div > div {
        margin-left: 350px;
        line-height: 150px;
    }


    #dkgb {
        display: inline-block;

    }
</style>
